@import "../../base/util";
@assetUrl:'../images/module/card/img-title-like-view-status-card001';
.card001 {

  .list-item {
    overflow: hidden;
    .setWH(288px, 250px);
    position: absolute;
    &.active {
      //font-weight: bold;
      background-color: #07969b;
    }
  }
  .list-item-wrap {
    margin: 2px;
    position: relative;
    .setWH(284px, 246px);
    .status {
      .setWH(80px, 30px);
      .absolute(5px, 8px);
      z-index: 2;
      text-align: center;
      .line-height(30px);
      font-size: 18px;
    }
    .status-0 {
      background: url("@{assetUrl}/status-0.png");
      color: #ccc;
    }
    .status-1 {
      color: #ffb400;
      background: url("@{assetUrl}/status-1.png");
    }
    .thumb {
      width: 100%;
      height: 100%;
      .absolute(0, 0);
      overflow: hidden;
      img{
        width: 100%;
        height: 100%;
      }
    }
    .mask {
      .setWH(284px, 246px);
      z-index: 1;
      background: url("@{assetUrl}/mask.png");
      .absolute(0, 0);
    }
    .viewNum, .likeNum {
      display: inline-block;
      text-align: center;
      p {
        margin-top: 6px;
      }
    }
    .statistics {
      position: absolute;
      top: 3px;
      right: 3px;
      z-index: 2;
    }
    .likeNum {
      margin-left: 10px;
    }
    .name {
      text-align: center;
      .line-height(48px);
      width: 100%;
      position: absolute;
      bottom: 0;
      left: 0;
      z-index: 2;
      font-size: 20px;
    }
  }
}